<template>
    <ul class="mblist">
        <van-checkbox-group v-model="checkeds" shape="square" @change="change">
            <li v-for="dt in list" :key="dt.userid">
                <van-checkbox :name="dt.userid">{{dt.name}}</van-checkbox> 
            </li>
        </van-checkbox-group>
    </ul>

</template>

<script setup>
import {ref,onMounted} from 'vue'
import {getMemberList} from '@/api/qy-wechat-api'

const props = defineProps({
    modelValue:'',
})

const emit = defineEmits(['update:modelValue'])

const list = ref([])
const checkeds = ref([])

onMounted(async ()=>{
    // 腾讯接口直接获取的数据
    const res = await getMemberList()
    list.value = res.data
})

const change = ()=>{
    emit('update:modelValue',checkeds.value)
}
</script>
<style lang="scss" scoped>
.mblist{
    list-style: none;
    padding: 0;
    margin: 0;
    li{
        display: flex;
        padding: 0 20px;
        height: 80px;
        background-color: #fbfbfb;
        margin: 10px 0 0 0;
        align-items: center;
    }
}
</style>